<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" type="text/css" href="${request.contextPath}/resources/css/demo.css">
    <script src="${request.contextPath}/resources/js/core/jquery/jquery-3.3.1.min.js"></script>
    <script>
        $(function () {
            $('#button1').click(function () {
                var id=$("#input1").val();
                $.ajax({
                    type:"post",
                    url: '${request.contextPath}/demo/demo1',
                    data: { userName: id},
                    success: function (data) {
                        if(data.success == true)
                        {
                            var result=data.result;
                            var user = result.user;
                            if(user != null)
                            {
                                var tr = '<tr><td>'+user.userId+'</td><td>'+user.userName+'</td></tr>';
                                $("#tbody1").html("");
                                $("#tbody1").append(tr);
                            }
                            else
                            {
                                $("#tbody1").html("");
                            }

                        }
                        else
                        {
                            $("#tbody1").html("");
                        }

                    }
                });
            });
        });
    </script>
</head>
<body>
    <div>
        <input class="input" type="text" name="input1" id="input1" >
        <button type="button" class="button" id="button1" name="button1">提交</button>
    </div>
    <div>
        <table>
            <tr >
                <th >id</th>
                <th >name</th>
            </tr>
            <tbody id="tbody1">
            </tbody>
        </table>
    </div>


</body>
</html>